
/*
    一、用户信息录入校验
    1.表单初始化，提示必填（*，红色）和非必填；
    2.输入框获取焦点时，提示信息：输入框的格式要求（蓝色）；
    3.输入框失去焦点时，正则表达式去校验输入值是否满足要求；
        3.1满足，提示√；
        3.2不满足，提示×；

    补充：部分字段，加入ajax防重校验；

    二、点击提交按钮，对所有的输入框再次全部检查一次，不满足的提示；
 */

//声明表单所需控件
var userCode = $("#userCode");
var userPassword = $("#userPassword");
var ruserPassword = $("#ruserPassword");

var path = $("#path").val();http://localhost:8080//zuche/js/jquery-1.8.2.js
var imgYes = "<img width='15px' src='"+path+"images/y.png' />";
var imgNo = "<img width='15px' src='"+path+"images/n.png' />";
//提交按钮
var add = $("#add");

//构造工厂
$(function () {
    //01.初始化执行内容
    userCode.next().html("*");
    userPassword.next().html("*");
    ruserPassword.next().html("*");

    //02.声明绑定事件
    userCode.bind("focus",function () {
        // $(this).next().css({"color":"blue"}).html("请输入6-10位的用户编码，以字母和数字组成");
        validateTip($(this).next(),{"color":"#f4411e","font-size":"5px","text-align":"center"},"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;请输入6-10位的用户编码，以字母和数字组成",false);
    }).bind("blur",function () {
        var codeRegx = /^\w{6,10}$/;
        if(!codeRegx.test($(this).val())){//校验不通过
            // $(this).next().css({"color":"red"}).html(imgNo);
            validateTip($(this).next(),{"color":"red"},imgNo,false);
        }else{//校验通过
            // $(this).next().css({"color":"green"}).html(imgYes);
            // $(this).attr("isPass",true);
            validateTip($(this).next(),{"color":"green"},imgYes,true);

            //调用ajax进行防重校验
            $.ajax({
                url:path+"/user/userCodeExists",
                type:"GET",
                data:{"userCode":userCode.val()},
                dataType:"json",
                success:function (data) {
                    console.log(data);
                    if(null == data || null == data.retCode){
                        alert("用户名重复校验失败！");
                        return;
                    }
                    if('F' == data.retCode){
                        validateTip(userCode.next(),{"color":"red"},"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;该用户名已经被占用",false);
                    }else if('T' == data.retCode){
                        validateTip(userCode.next(),{"color":"green"},"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;该用户名可以使用",true);
                    }
                },
                error:function (e) {
                    console.log(e);
                }
            });
        }
    });
    userPassword.bind("focus",function () {
        $(this).next().css({"color":"#f4411e","font-size":"5px","text-align":"center"}).html("&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;请输入6-10位的用户密码，以字母和数字组成");
    }).bind("blur",function () {
        var codeRegx = /^\w{6,10}$/;
        if(!codeRegx.test($(this).val())){//校验不通过
            // $(this).next().css({"color":"red"}).html(imgNo);
            validateTip($(this).next(),{"color":"red"},imgNo,false);
            ruserPassword.attr("readonly");
        }else{//校验通过
            // $(this).next().css({"color":"green"}).html(imgYes);
            validateTip($(this).next(),{"color":"green"},imgYes,true);
            //确认密码的readonly去掉
            ruserPassword.removeAttr("readonly");
        }
    });
    ruserPassword.bind("focus",function () {
        $(this).next().css({"color":"#f4411e","font-size":"5px"}).html("&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2次输入的密码要一致");
    }).bind("blur",function () {
        var pwd_01 = userPassword.val();
        var pwd_02 = ruserPassword.val();
        if(pwd_02 == null || pwd_02 == ''){
            // $(this).next().css({"color":"red"}).html("密码不能为空。");
            validateTip($(this).next(),{"color":"red","font-size":"5px"},"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;密码不能为空。",false);
        }else if(pwd_01 != pwd_02){
            //校验不通过
            // $(this).next().css({"color":"red"}).html(imgNo+"2次密码不一致");
            validateTip($(this).next(),{"color":"red","font-size":"5px"},imgNo+"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2次密码不一致",false);
        }else{//校验通过
            // $(this).next().css({"color":"green"}).html(imgYes);
            validateTip($(this).next(),{"color":"green"},imgYes,true);
        }
    });

    //绑定提交按钮的点击事件
    add.bind("click",function () {
        if(!userCode.attr("isPass")){
            userCode.trigger("blur");//触发失去焦点事件
            return;
        }
        if(!userPassword.attr("isPass")){
            userPassword.trigger("blur");//触发失去焦点事件
            return;
        }
        if(!ruserPassword.attr("isPass")){
            ruserPassword.trigger("blur");//触发失去焦点事件
            return;
        }
        //..TODO省略校验
        //当一切的校验通过，调用form提交方法
        $("#userForm").submit();
    });
});

function validateTip(element,css,tipString,status){
    element.css(css);
    element.html(tipString);

    element.prev().attr("isPass",status);
}